<template>
  <div v-if="bodyFileUrl!=''" id="bodyfilebox" :style="'height:'+height" class="bodyfile-container">
    <iframe id="pdfHtml" width="100%" height="100%" frameborder="0" :src="bodyFileUrl" />
  </div>
  <div v-else id="bodyfilebox" :style="'height:'+height" class="bodyfile-container">
    <svg-icon icon-class="word1" class="nofile" />
    <div style="margin-top:20px">请上传正文...</div>
  </div>
</template>

<script>
export default {
    name: 'ViewBodyFile',
    components: {

    },
    props: {
        flBodyfile: { type: Object, default: function() { return { file: { name: '' }} } },
        wfAttachUrl: { type: String, default: 'wfInstance/wfBusiAttach' },
        height: { type: String, default: '600px' },
        waterMark: { type: Boolean, default: false },
        markContent: { type: String, default: '' }
    },
    data() {
        return {
            bodyFileUrl: ''
        }
    },
    computed: {

    },
    watch: {
        flBodyfile() {
            this.viewBodyFile(this.flBodyfile)
        }
    },
    created() {
        this.viewBodyFile(this.flBodyfile)

        this.$bus.on('reloadBodyFile', this.reloadBodyFile)
    },
    beforeDestroy() {
        this.$bus.off('reloadBodyFile', this.reloadBodyFile)
    },
    mounted() {

    },
    methods: {
        viewBodyFile(flBodyfile) {
            if (flBodyfile == null || flBodyfile.id === undefined) {
                this.bodyFileUrl = ''
                return
            }
            const extName = this.flBodyfile.originalName.substring(this.flBodyfile.originalName.indexOf('.')).toLowerCase()

            if (extName === '.pdf' || extName === '.pdf.des' || extName === '.pdf.xor' || extName === '.pdf.rsm3') {
                let fileurl = process.env.VUE_APP_BASE_API + '/' + this.wfAttachUrl + '/downloadById?inline=true&attachIds=' + this.flBodyfile.id + '&widthType=100'
                fileurl += '&httpPort=' + location.port + '&waterMark=' + this.waterMark + '&markContent=' + this.markContent
                // const token = window.$auth.getToken()
                this.bodyFileUrl = './plugins/PDFjs/web/viewer.html?file=' + encodeURIComponent(fileurl)
            }
        },
        reloadBodyFile() {
            const bodyFileUrl = this.bodyFileUrl
            this.bodyFileUrl = ''
            this.$nextTick(() => {
                this.bodyFileUrl = bodyFileUrl
            })
        }
    }
}
</script>

<style scoped lang="scss">
    #bodyfilebox{
        height:calc(100vh - 305px)!important;
        border:1px solid #EBEEF5;
        padding-bottom:1px;
        background-color: #f3f3f3;
        text-align:center;
         font-size: 16px;
    }
    .nofile{
        width: 100px!important;
        height: 100px!important;
        margin-top: 100px;
    }
</style>
